
import { NavBar } from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
import { BellOutline } from 'antd-mobile-icons'



function Index() {
    const nav=useNavigate()
    
  
  const handleBack = () => {
    
    nav(-1) // 返回上一个页面
  }

  return (
    <div>
        <NavBar onBack={handleBack}>医生消息</NavBar>
        <div
          onClick={()=>nav('/chat')}
          style={{
            display:'flex',
            alignItems:'center',
            justifyContent:'space-between',
            padding:'12px 16px'
          }}
        >
          <div style={{display:'flex',alignItems:'center'}}>
            <div style={{
              width:'36px',
              height:'36px',
              borderRadius:'50%',
              backgroundColor:'#3674ff',
              display:'flex',
              alignItems:'center',
              justifyContent:'center',
              marginRight:'12px'
            }}>
              <BellOutline color="#ffffff" />
            </div>
            <div>
              <div style={{fontSize:'16px'}}>系统通知</div>
              <div style={{fontSize:'12px',color:'#9e9e9e'}}>近期热门推荐</div>
            </div>
          </div>
          <div style={{fontSize:'12px',color:'gray'}}>9月11日</div>
        </div>
        <hr />
    </div>
  )
}

export default Index
